從 JavaScript 角度學 Python(21) - Requests - iT 邦幫忙::一起幫忙解決難題，拯救 IT 人的一天

2021 iThome 鐵人賽

DAY 21

Software Development

從 JavaScript 角度學 Python系列第 21 篇

從 JavaScript 角度學 Python(21) - Requests

13th鐵人賽 javascript python

Ray

團隊IT成長營

2021-09-22 00:00:17

2194 瀏覽

分享至

前言

在 JavaScript 中 AJAX 是一個非常重要的基礎功，畢竟現在很流行前後端分離，因此這一篇也想聊聊關於 Python 的部分，Python 可以做到 AJAX 嗎？所以這一篇就來聊聊關於 Python 的 Requests 套件吧。

AJAX

我們先回味一下什麼是 AJAX，AJAX 全名是 Asynchronous JavaScript and XML，中文又譯「非同步 JavaScript 與 XML」，看到這裡可能有些人已經覺得我在公 x 小朋友了...

所以這邊簡單講好了，如果你有使用過 React、Vue 與 Angular 的話一定接觸過一個東西，也就是 axios、fetch 或者是 XMLHttpRequest 等 AJAX 語法。

而這種行為操作最常見用於現在所流行的 SPA (Single Page Application，又稱之為單頁式應用程式)，而 AJAX 重點在於非同步取得資料，什麼意思呢？

你試著思考一下早期我們在操作 or 切換網頁畫面時，是不是都會出現一瞬間的白畫面？而現今的 SPA 開發模式狀況下，畫面上會有一個 Loading 的字樣或者圖片擋在畫面上，但是你會發現 Url 都不會有任何變化，但是網頁上的資料卻有所變化，而這一段就是透過 AJAX 所達到的。

那麼上面所講的操作 or 切換畫面時所出現的一瞬間白畫面狀況，那這種狀況就是常見 SSR (全名是 Server Side Render，中文名稱是伺服器渲染)，如果你對於 SPA、SSR 等觀念不熟悉的話，我會建議你可以閱讀看看我先前寫的「淺談 SPA、CSR、SSR、MPA、SSG 專有名詞」會有更詳細的介紹。

稍微有一點扯遠了，那麼為什麼我們會需要了解關於 AJAX 這個觀念呢？最主要是因為我們接下來要透過 Python 來達到相同的效果，例如： Get 取得遠端伺服器的資料、Post 新增資料到遠端伺服器等，因此就不能不先回顧一下這個觀念。

axios 回味

那麼前面也先快速回味一下 axios 套件的部分，所以下面就會列出一些滿常見的 axios 寫法：

// get
axios.get('/').then(() => {
  ...
})

// post
axios.post('/name', {
  data: 'ray'
}).then(() => {
  ...
})

// put
axios.put('/name/ray1', {
  data: 'ray'
}).then(() => {
  ...
})

// delete
axios.delete(`/name/ray1`).then(() => {
  ...
})

axios 本身就是 Promise 因此也可以使用 ES7 語法中的 async/await 簡寫：

async function getName() {
  try {
    const response = await axios.get('/name');
    console.log(response);
  } catch (error) {
    console.error(error);
  }
}

最後還有另一種寫法是使用傳參數的方式：

axios({
  method: 'get',
  url: '/name',
})

最後提一下，如果你有使用 Vue Cli 的人可能會是這樣寫：

// get
this.$http.get('/')

// post
this.$http.post('/name', {
  data: 'ray'
})

// put
this.$http.put('/name/ray1', {
  data: 'ray'
})

// delete
this.$http.delete(`/name/ray1`)

雖然我們也可以不使用 axios 套件，直接使用瀏覽器所提供的 Fetch API or XMLHttpRequest 等 Web APIs 達到 AJAX 請求，但實際上來講我們在開發時，還是比較常使用 axios 套件，所以前面也是快速提一下 axios 套件的各種寫法，等一下才會覺得 Python 的部分會比較親民。

Requests

前面講了那麼多，那麼 Python 呢？Python 有辦法本身有提供類似 Fetch API 或者是 XMLHttpRequest 等 Web APIs 嗎？答案是沒有的。

因此我們必須使用一個套件叫做 Requests 套件，透過使用 Requests 套件我們就可以達到一樣的 AJAX 行為，只是在安裝之前請務必注意 Requests 套件在 Python2 與 Python3 的安裝是不太一樣，下面也提供安裝指令給你參考：

// Python 2.x
pip install requests

// Python 3.x
pip3 install requests2

基本上 Requests 套件使用的方式非常簡單，所以這邊就直接來看一個基礎範例寫法比較快：

import requests

r = requests.get('https://www.google.com/')

不論你安裝的是 requests2 還是 requests，在引入模組時一率都是使用 import requests 即可。

看完上面範例有沒有頓時覺得超級像 axios 的寫法呢？感覺就只是單純換個單字罷了，沒有錯就是這麼簡單。

只是如果你直接 print(r) 出來你會發現，並不是你預期的 Get 內容，你可能會看到一串字串也就是 <Response [200]>

所以正確來講你如果想看到內容的話，就要額外處理一下唷～

那該怎麼處理呢？這邊就讓我們直接閱讀 requests 官方文件的寫法來試試看：

import requests

r = requests.get('https://www.google.com/')
print(r.status_code) # 200
print(r.headers['content-type']) # text/html; charset=ISO-8859-1
print(r.encoding) # ISO-8859-1
print(r.text) # <!doctype html><html itemscope="" ...
print(r.json()) # 這個會出現錯誤是因為請求的是一個 HTML 檔案，否則通常會像是官方文件所寫的 JSON 格式

可以發現 requests 非常的方便，那麼 requests 的 get、post、put、delete 請求該怎麼寫呢？其實非常的簡單，只要你有使用過 axios 套件的話，那麼你就絕對會覺得很親切：

import requests

# get
r = requests.get('/')

# post
r = requests.post('/', data = { 'data': 'ray' })

# put
r = requests.put('/', data = { 'data': 'ray' })

# delete
r = requests.delete('/name/ray1')

什麼？你覺得根本不親切？好，沒關係！那我們重新命名一下 requests：

import requests as axios

# get
r = axios.get('/')

# post
r = axios.post('/', data = { 'data': 'ray' })

# put
r = axios.put('/', data = { 'data': 'ray' })

# delete
r = axios.delete('/name/ray1')

這樣夠 axios 套件的風格了吧